<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="../../js/usual.js"></script>

<link type ="text/css" rel="stylesheet" href="../../css/user-index.css"/>
<title>store</title>
<style>
	
	
</style>
</head>
<body style="margin:0;">
	<div class="header">
		<span class="customer_account">
			hellosssssssssxxxxxxxxxxxxxxx
		</span>
		<img src="../../images/cart1.png"/>
		<span class="cart">			
			购物车
		</span>	
		<div style="clear:both;"></div>
	</div>
	<div class="search_div">
		<div class="sclogo">
			<img src="../../images/logo.png">
		</div>
		<div class="search_kuang">
			<input class="hidden_search" type="hidden" value="宝贝" />
			<div class="search_good">
				<span>宝贝</span>
			</div>
			<div class="search_business">
				<span>商铺</span>
			</div>
			<div style="clear:both;"></div>
			<div class="search">
				<input class="search_text" type="text" value="" placeholder="请输入您要搜索的商品" />
				<div class="carema">
					<img src="../../images/camera.jpg"  />
				</div>
				<input class="search_btn" type="button" value="搜索" />
			</div>
			
		</div>
		
	</div>
	<div class="content">
		<div class="classify">
			<div class="class1">
				<a href=""><span>天猫</span></a>
			</div>
			<div class="class1">
				<a href=""><span>聚划算</span></a>
			</div>
			<div class="class1">
				<a href=""><span>天猫超市</span></a>
			</div>
			<div class="class1">
				<a href=""><span>淘抢购</span></a>
			</div>
			<div class="class1">
				<a href=""><span>电器城</span></a>
			</div>
			<div class="class1">
				<a href=""><span>淘宝心选</span></a>
			</div>
			<div class="class1">
				<a href=""><span>兴农扶贫</span></a>
			</div>
			<div class="class1">
				<a href=""><span>母婴用品</span></a>
			</div>
			<div class="class1">
				<a href=""><span>飞猪旅行</span></a>
			</div>
			<div class="class1">
				<a href=""><span>智能生活</span></a>
			</div>
			<div style="clear:both;"></div>
		</div>
		<div class="container">
			<div class="wrap" style="left: -700px;">
			
				<div style="float:left;margin:0;border-color:none;padding:0;width:700px;">
					<img src="../../images/轮播3.jpg" alt="2">	
					<div style="margin-left:10%;">
						<span style="font-size:25px;line-height:25px;margin-top:0;" ><br/>羽绒服</span>
					</div>
					
				</div>
				<div style="float:left;margin:0;border:none;padding:0;width:700px;">
					<img src="../../images/轮播1.jpg" alt="0">
					<div style="margin-left:10%;">
						<span style="font-size:25px;line-height:25px;margin-top:0;" ><br/>儿童毛衣</span>	
					</div>
				</div>	
				<div style="float:left;margin:0;border:none;padding:0;width:700px;">
					<img src="../../images/轮播2.jpg" alt="1">	
					<div style="margin-left:10%;">
						<span style="font-size:25px;line-height:25px;margin-top:0;"><br/>中年礼服</span>
						
					</div>
				</div>
				<div style="float:left;margin:0;border:none;padding:0;width:700px;">
					<img src="../../images/轮播3.jpg" alt="2">	
					<div style="margin-left:10%;">
						<span style="font-size:25px;line-height:25px;margin-top:0;"><br/>羽绒服</span>
					</div>
				</div>
				<div style="float:left;margin:0;border:none;padding:0;width:700px;">
					<img src="../../images/轮播1.jpg" alt="0">
					<div style="margin-left:10%;">
						<span style="font-size:25px;line-height:25px;margin-top:0;" ><br/>儿童毛衣</span>
					</div>
				</div>
				
				
			</div>
			
			<a href="javascript:;" style="text-decoration: none;" rel="external nofollow" class="arrow arrow_left"><</a>
			<a href="javascript:;" style="text-decoration: none;" rel="external nofollow" class="arrow arrow_right">></a>
		</div>
		<div class="info">
			<div class="title">新增商品</div>
			<div class="list">
				<ol class="ol_addnew">
				</ol>
			</div>
			
			<div class="title">销量最佳</div>
			<div class="list">
				<ol class="ol_addbest">
					
			
				</ol>
			</div>
		</div>
		
		
	</div>

<script>

	var data1={
			 "type":"new_goods"	 
	};
	
	var data2={
			 "type":"best_goods"
	};

	$.ajax({
	        type:"get",
	        url: "http://localhost:8080/shop/html/index",
	        data: data1,
	        cache: false,
	        async : false,
	        success: function (data ,textStatus, jqXHR)
	        {

	        	//alert(data[0]);
	        	//<li><a href=""><span>hellohellohellohellohellohellohellohellohello</span></a></li>
	        	for(var i=0;i<data.length;i++){
	        		$('.ol_addnew').append('<li><a href=""><span>'+data[i]+'</span></a></li>');
	        	}
	        },
	        error:function (XMLHttpRequest, textStatus, errorThrown) {      
	        	//alert("发生错误");
	        }
	    });
	
	$.ajax({
        type:"get",
        url: "http://localhost:8080/shop/html/index",
        data: data2,
        cache: false,
        async : false,
        success: function (data ,textStatus, jqXHR)
        {

        	for(var i=0;i<data.length;i++){
        		$('.ol_addbest').append('<li><a href=""><span>'+data[i]+'</span></a></li>');
        	}
        },
        error:function (XMLHttpRequest, textStatus, errorThrown) {      
        	//alert("发生错误");
        }
    });

	



   var wrap = document.querySelector(".wrap");
    var next = document.querySelector(".arrow_right");
    var prev = document.querySelector(".arrow_left");
    next.onclick = function () {
      next_pic();
    }
    prev.onclick = function () {
      prev_pic();
    }
    function next_pic () {
      var newLeft;
      if(wrap.style.left === "-2800px"){
        newLeft = -1400;
      }else{
        newLeft = parseInt(wrap.style.left)-700;
      }
      wrap.style.left = newLeft + "px";
    }
    function prev_pic () {
      var newLeft;
      if(wrap.style.left === "0px"){
        newLeft = -2800;
      }else{
        newLeft = parseInt(wrap.style.left)+700;
      }
      wrap.style.left = newLeft + "px";
    }
    var timer = null;
    function autoPlay () {
      timer = setInterval(function () {
        next_pic();
      },1500);
    }
    autoPlay();
 
    var container = document.querySelector(".container");
    container.onmouseenter = function () {
      clearInterval(timer);
    }
    container.onmouseleave = function () {
      autoPlay();  
    }

    
    $('.search_good').click(function(){
    	$('.search_good').css({"background-color":"#fff","color":"#3f3f3f"});
    	 $('.search_business').css({"background-color":"#3f3f3f","color":"#fff"});
    	 $('.hidden_search').val("宝贝");
    	 $('.search_text').attr("placeholder","请输入您要搜索的商品");
    });
    
    $('.search_business').click(function(){
   	 $('.search_business').css({"background-color":"#fff","color":"#3f3f3f"});
   	 $('.search_good').css({"background-color":"#3f3f3f","color":"#fff"});
   	$('.hidden_search').val("商铺");
   	$('.search_text').attr("placeholder","请输入您要搜索的商铺");
   
   });
  </script>

</body>
</html>